<template>
	<div class="scene_root">
		<div class="View">
			<!-- tab切换菜单 -->
			<el-tabs
				v-model="activeName"
				@tab-click="handleTabClick"
				class="bh-tab"
			>
				<el-tab-pane
					:label="$t('message.userManageView.manageTabTitle')"
					name="usermanage"
				>
				</el-tab-pane>
			</el-tabs>
		</div>

		<div class="content-lay">
			<userManageView v-if="activeName == 'usermanage'" />
			<pfdRelationView v-if="activeName == 'pfd'" />
		</div>
	</div>
</template>

<script>
import userManageView from '../userManage/userManageView'
import { getUser, delUser, addUser } from "../../api/api";
import { getLocalStorage } from "../../utils/storage";
import $ from "jquery";
// 导出模块
export default {
	// 模块名字
	name: "HomePageView",
	// 模块数据
	data() {
		var validatePass = (rule, value, callback) => {
			if (!/^[\S]{6,50}$/.test(this.formLabelAlign.pwd)) {
				callback(
					new Error(this.$t("message.userPageTable.rules.checkPsd"))
				);
			} else {
				if (
					this.formLabelAlign.pwd !== "" &&
					/^[\S]{6,50}$/.test(this.formLabelAlign.pwd)
				) {
					this.$refs.formLabelAlign.validateField("checkPass");
				}
				callback();
			}
		};
		var validatePass2 = (rule, value, callback) => {
			if (value !== this.formLabelAlign.pwd) {
				callback(
					new Error(
						this.$t("message.userPageTable.rules.checkPsdTip")
					)
				);
			} else {
				callback();
			}
		};

		var checkMobile = (rule, value, callback) => {
			if (
				!/^(((\\+\\d{2}-)?0\\d{2,3}-\\d{7,8})|bai((\\+\\d{2}-)?(\\d{2,3}-)?([1][3,4,5,7,8][0-9]\\d{8})))$/.test(
					this.formLabelAlign.mobilex
				)
			) {
				callback(
					new Error(
						this.$t("message.userPageTable.rules.checkMobile")
					)
				);
			} else {
				callback();
			}
		};

		var checkEmail = (rule, value, callback) => {
			if (
				!/^([A-Za-z0-9_+-.])+@([A-Za-z0-9\-.])+\.([A-Za-z]{2,22})$/.test(
					this.formLabelAlign.email
				)
			) {
				callback(
					new Error(this.$t("message.userPageTable.rules.checkEmail"))
				);
			}
		};
		var checkAcc = (rule, value, callback) => {
			if (this.formLabelAlign.acc == "") {
				callback(this.$t("message.userPageTable.rules.checkUserName"));
			}
		};
		var checkName = (rule, value, callback) => {
			if (this.formLabelAlign.name == "") {
				callback(
					new Error(this.$t("message.userPageTable.rules.checkName"))
				);
			}
		};
		var checkAccType = (rule, value, callback) => {
			if (this.formLabelAlign.accType == "") {
				callback(
					new Error(
						this.$t("message.userPageTable.rules.checkUserType")
					)
				);
			}
		};
		//数据
		return {
      activeName: "usermanage",
    };
	},
	// 注册组件
	components: {
    userManageView,
  },
	// 监听指定值，只有指定值变化，才会触发
	watch: {},
	// 里面的函数只有调用才会执行（实时计算）里面是定义的方法
	methods: {
    handleTabClick() {

    }
  },
	// 创建前状态(里面是操作)
	beforeCreate() {},
	// 创建完毕状态(里面是操作)
	created() {},
	// 挂载前状态(里面是操作)
	beforeMount() {},
	// 挂载结束状态(里面是操作)
	mounted() {},
	// 更新前状态(里面是操作)
	beforeUpdate() {},
	// 更新完成状态(里面是操作)
	updated() {},
	// 销毁前状态(里面是操作)
	beforeDestroy() {
		window.removeEventListener("resize", function () {});
	},
	// 销毁完成状态(里面是操作)
	destroyed() {},
};
</script>
<style  lang="scss" scoped>
.scene_root {
	height: 100%;
  	width: calc(100% - 257px);
	// width: 100%;
	//     display: flex;
	//     flex-direction: column;
	background: #f8f8f8;
}

.View {
	width: 100%;
	// 顶部tab
	.bh-tab {
		width: 100%;
		// height: 100%;
		::v-deep .el-tabs__header {
			margin: 15px 24px 0 24px;
			width: calc(100% -48px);
		}
		::v-deep .el-tabs__content {
			height: calc(100% - 55px);
		}
		::v-deep #pane-first {
			height: 100%;
		}
		::v-deep #pane-second {
			height: 100%;
		}
		::v-deep #pane-third {
			height: 100%;
		}
	}
}

.content-lay {
  width: 100%;
	height: calc(100% - 55px);
	box-sizing: border-box;
	margin: 0 24px;
	padding-bottom: 24px;
}
</style>
 